// 所有和权限控制相关的
import router from './router'
import { asyncRoutes } from './router/asyncRoutes';
import { getToken } from './utils/auth';
import store from './store';

const WHITE_LIST = ['/login', '/404']

// 处理一级路由权限数据
function getFirstRoutePerms(permsArr) {
    const newArr = permsArr.map(item => {
        return item.split(':')[0]
    })
    return [...new Set(newArr)]
}

// 处理二级路由权限数据
function getSecondRoutePerms(permsArr) {
    const newArr = permsArr.map(item => {
        const arr = item.split(':')
        return `${arr[0]}:${arr[1]}`
    })
    return [...new Set(newArr)]
}

// 根据权限标识过滤路由表
function getRoutes(firstRoutePerms, secondRoutePerms, asyncRoutes) {
    if (firstRoutePerms.includes('*')) {
        // 当前登录人为admin
        return asyncRoutes
    }
    // 根据一级和二级对动态路由表做过滤 return过滤后的路由表
    // 1. 根据一级路由表动态路由表做过滤
    return asyncRoutes.filter(route => {
        return firstRoutePerms.includes(route.permission)
    }).map(item => {
        return {
            ...item,
            children: item.children.filter(child => secondRoutePerms.includes(child.permission))
        }
    })
}

// 1. 路由前置守卫
router.beforeEach(async (to, from, next) => {
    // from 路由对象 从哪里来的那个对象
    // to 目标路由对象 到哪里去
    // next 放行函数
    const token = getToken()
    if (token) {
        next()
        if (!store.state.user.userProfile.id) {
            // 1. 调用action函数 获取用户权限数据
            const perms = await store.dispatch('user/getUserProfile')
            // 2. 将后端的权限数组格式化成我们自己的两个权限数据
            // console.log(perms);
            const firstRoutePerms = getFirstRoutePerms(perms)
            // console.log(firstRoutePerms);
            const secondRoutePerms = getSecondRoutePerms(perms)
            // console.log(secondRoutePerms);
            // 3. 根据权限标识 过滤筛选 动态路由表 最终得到有资格显示到左侧的所有路由表
            const routes = getRoutes(firstRoutePerms, secondRoutePerms, asyncRoutes)
            // console.log(routes);
            // 4. 把动态路由表加入到路由系统中（当浏览器中访问卤藕的路径 显示渲染出来对应的组件）
            routes.forEach(route => {
                router.addRoute(route)
            });
            // 5. 调用mutation函数 把路由表存入vuex
            store.commit('menu/setMenuList', routes)
        }

    } else {
        // 是否在白名单内 - 是否在数组中能找到 - path - to.path
        if (WHITE_LIST.includes(to.path)) {
            next()
        } else {
            next('/login')
        }
    }
})

console.log('权限控制生效');
